<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<head>
    <!-- meta tags -->
    <meta charset="utf-8">

    <!-- Title -->
    <title>首页</title>
    <script src="/mallWeb/static/js/jquery-3.5.1.min.js"></script>

    <!-- Favicon Icon -->
    <link rel="shortcut icon" href="/mallWeb/static/images/favicon.png"/>
    <style type="text/css">
        .container_search {
            width: 590px;
            margin: 0 auto;
            padding-top: 100px;
            position: relative;
        }

        .container_search:after {
            content: '';
            display: block;
            clear: both;
        }

        .container_search > div {
            float: left;
        }

        .container_search .logo {
            width: 100%;
            height: 120px;
            margin: 0 auto 10px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: auto 120px;
        }

        .container_search .input {
            position: relative;
            width: 500px;
            height: 44px;
            border-top: #ccc solid 1px;
            border-right: none;
            border-bottom: #ccc solid 1px;
            border-left: #ccc solid 1px;
            border-radius: 4px 0 0 4px;
        }

        .container_search .input > input {
            outline: none;
            border: none;
            padding: 0 80px 0 10px;
            margin: 0;
            height: 40px;
            width: 410px;
            color: #333;
            font-size: 16px;
            border-radius: 4px 0 0 4px;
        }

        .container_search .input > input::-webkit-input-placeholder {
            color: #999;
        }

        .container_search .input .picker {
            width: 40px;
            padding-right: 30px;
            position: absolute;
            top: 0;
            right: 0;
            height: 100%;
            line-height: 44px;
            cursor: pointer;
            color: #999;
            font-size: 12px;
            text-align: right;
            background-image: url("/mallWeb/static/images/down.png");
            background-position: 50px center;
            background-repeat: no-repeat;
            user-select: none;
        }

        .container_search .input .picker-list {
            list-style: none;
            padding: 5px 0;
            width: 100px;
            position: absolute;
            right: 0;
            top: 50px;
            margin: 0;
            line-height: 26px;
            font-size: 12px;
            border-radius: 2px;
            box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
            background-color: #fff;
            display: none;
        }

        .container_search .input .picker-list > li {
            padding-left: 36px;
            background-position: 10px center;
            background-repeat: no-repeat;
            background-size: 16px auto;
        }

        .container_search .input .picker-list > li:hover {
            background-color: #ebf1f5;
            cursor: pointer;
        }

        .container_search .input .hot-list {
            padding: 10px 0;
            width: 100%;
            position: absolute;
            left: 0;
            top: 50px;
            margin: 0;
            line-height: 32px;
            font-size: 14px;
            border-radius: 2px;
            box-shadow: 0 1px 5px rgba(0, 0, 0, .2);
            background-color: #fff;
            display: none;
        }

        .container_search .input .hot-list > a {
            display: block;
            color: #333;
            text-decoration: none;
            padding: 0 10px;
            overflow: hidden;
        }

        .container_search .input .hot-list > a:hover {
            background-color: #f3f3f3;
        }

        .container_search .input .hot-list > a > div {
            float: left;
        }

        .container_search .input .hot-list > a > div.number {
            text-align: center;
            width: 40px;
        }

        .container_search .search {
            width: 89px;
            height: 46px;
            background-color: #08f;
            background-image: url("/mallWeb/static/images/search.png");
            background-position: center;
            background-repeat: no-repeat;
            border-radius: 0 4px 4px 0;
            cursor: pointer;
        }
    </style>
    <!--弹出层的引用 -->
    <link href="/mallWeb/static/layui/css/layui.css" rel="stylesheet"/>
    <script src="/mallWeb/static/layui/layui.js"></script>

    <link href="/mallWeb/static/css/theme-plugin.css" rel="stylesheet"/>
    <link href="/mallWeb/static/css/theme.min.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/layer/default/layer.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/code.css" rel="stylesheet"/>
    <link href="/mallWeb/static/layui/css/modules/laydate/default/laydate.css" rel="stylesheet"/>
    <!-- inject css start -->

    <!-- inject css end -->
    <style>
        .Personal_center {
            position: relative;
            display: inline-block;
            width: 30px;
            height: 30px;
            margin: auto auto auto auto;
            border: 0px solid #6a89cc;
            border-radius: 50%;
        }

        .Personal_center img {
            position: absolute;
            width: 30px;
            height: 30px;
            margin-right: 0.5rem;
            border-radius: 50%;
            overflow: hidden;
        }

        .drop_option {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            padding: 12px 10px;
        }

        .Personal_center:hover .drop_option {
            display: block;
        }
    </style>


</head>

<body>

<!-- page wrapper start -->

<div class="page-wrapper">

    <!-- preloader start -->

    <div id="ht-preloader">
        <div class="loader clear-loader"><img class="img-fluid" src="/mallWeb/static/images/loader.gif" alt=""></div>
    </div>

    <!-- preloader end -->

    <header class="site-header header-1">
        <div class="header-top bg-dark-1 py-0">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-12 d-flex align-items-center justify-content-between text-white">
                        <div class="d-none d-md-flex align-items-center call-info">
                            <div class="d-flex align-items-center">
                                <div class="text-white offer-text"><small><img
                                        src="/mallWeb/static/images/share/shopping.png" width="30" height="30">
                                    欢迎来到校园易货网 </small></div>
                                <div class="language-selection">
                                    <div class="d-flex align-items-center justify-content-center justify-content-md-end">
                                        <div class="ml-3 mr-3">
                                        </div>
                                        <div class="lng_dropdown">
                                            <select name="countries" class="custome_select">
                                                <option value='en' data-image="/mallWeb/static/images/share/ZYNC.jpg"
                                                        data-title="ZYNC">遵义师范学院
                                                </option>
                                                <option value='fn' data-image="/mallWeb/static/images/share/ZYNU.jpg"
                                                        data-title="ZYNU">遵义医科大学
                                                </option>
                                                <option value='us'
                                                        data-image="/mallWeb/static/images/share/OtherSchool.png"
                                                        data-title="Other School">其他学校
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex align-items-center">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="header-wrap">
            <div class="container">
                <div class="row">
                    <!--menu start-->
                    <div class="col">
                        <nav class="navbar navbar-expand-lg navbar-light position-static"><a class="navbar-brand logo"
                                                                                             href="index.html"> <img
                                class="img-fluid" src="/mallWeb/static/images/share/zync.png" width="180" height="80">
                        </a>
                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
                                    aria-expanded="false" aria-label="Toggle navigation"><span
                                    class="navbar-toggler-icon"></span></button>
                            <div class="collapse navbar-collapse" id="navbarNav">
                                <ul class="navbar-nav ml-auto mr-auto">
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle active"
                                                                     href="${pageContext.request.contextPath}/index-1">首页</a>
                                        <ul class="dropdown-menu">
                                            <li><a href="index-1.html">最新发布</a></li>
                                            <li><a href="index-1.html">综合最新</a></li>
                                            <li><a href="index-1.html">自营</a></li>
                                            <li><a href="index-1.html">闲置商品</a></li>
                                            <li><a href="index-1.html">夏季优选</a></li>
                                            <li><a href="index-1.html">精选商品</a></li>
                                            <li><a href="index-1.html">活动倒计时</a></li>
                                            <li><a href="index-1.html">博客</a></li>
                                        </ul>
                                    </li>
                                    <li class="nav-item dropdown position-static"><a class="nav-link dropdown-toggle"
                                                                                     href="${pageContext.request.contextPath}/autotrophy-1">自营</a>
                                        <div class="dropdown-menu w-100">
                                            <!-- Tabs -->
                                            <div class="container p-0">
                                                <div class="row w-100 no-gutters">
                                                    <div class="col-lg-8 p-lg-3">
                                                        <div class="row">
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装男</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">长袖</a></li>
                                                                    <li><a href="#">短袖</a></li>
                                                                    <li><a href="#">外套</a></li>
                                                                    <li><a href="#">羽绒服</a></li>
                                                                    <li><a href="#">牛仔裤</a></li>
                                                                    <li><a href="#">牛仔衣</a></li>
                                                                    <li><a href="#">短裤</a></li>
                                                                    <li><a href="#">绒裤</a></li>
                                                                    <li><a href="#">运动库</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装女</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">长袖</a></li>
                                                                    <li><a href="#">短袖</a></li>
                                                                    <li><a href="#">外套</a></li>
                                                                    <li><a href="#">羽绒服</a></li>
                                                                    <li><a href="#">牛仔裤</a></li>
                                                                    <li><a href="#">牛仔衣</a></li>
                                                                    <li><a href="#">短裤</a></li>
                                                                    <li><a href="#">绒裤</a></li>
                                                                    <li><a href="#">运动库</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">手机</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">华为</a></li>
                                                                    <li><a href="#">小米</a></li>
                                                                    <li><a href="#">苹果</a></li>
                                                                    <li><a href="#">一加</a></li>
                                                                    <li><a href="#">魅族</a></li>
                                                                    <li><a href="#">OPPO</a></li>
                                                                    <li><a href="#">VIVO</a></li>
                                                                    <li><a href="#">三星</a></li>
                                                                    <li><a href="#">努比亚</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">图书</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-0">
                                                                    <li><a href="#">小说</a></li>
                                                                    <li><a href="#">儿童读物</a></li>
                                                                    <li><a href="#">漫画</a></li>
                                                                    <li><a href="#">期刊</a></li>
                                                                    <li><a href="#">杂志</a></li>
                                                                    <li><a href="#">计算机技术</a></li>
                                                                    <li><a href="#">农业科学</a></li>
                                                                    <li><a href="#">中国文学</a></li>
                                                                    <li><a href="#">书法篆刻</a></li>
                                                                    <li><a href="#">经典读物</a></li>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 d-none d-lg-block pr-2"><img
                                                            class="img-fluid rounded-bottom rounded-top"
                                                            src="/mallWeb/static/images/header-img.jpg" alt="..."></div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="nav-item dropdown position-static"><a class="nav-link dropdown-toggle"
                                                                                     href="${pageContext.request.contextPath}/idle-goods-1">闲置商品</a>
                                        <div class="dropdown-menu w-100">
                                            <!-- Tabs -->
                                            <div class="container p-0">
                                                <div class="row w-100 no-gutters">
                                                    <div class="col-lg-8 p-lg-3">
                                                        <div class="row">
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装男</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">长袖</a></li>
                                                                    <li><a href="#">短袖</a></li>
                                                                    <li><a href="#">外套</a></li>
                                                                    <li><a href="#">羽绒服</a></li>
                                                                    <li><a href="#">牛仔裤</a></li>
                                                                    <li><a href="#">牛仔衣</a></li>
                                                                    <li><a href="#">短裤</a></li>
                                                                    <li><a href="#">绒裤</a></li>
                                                                    <li><a href="#">运动库</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">服装女</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">长袖</a></li>
                                                                    <li><a href="#">短袖</a></li>
                                                                    <li><a href="#">外套</a></li>
                                                                    <li><a href="#">羽绒服</a></li>
                                                                    <li><a href="#">牛仔裤</a></li>
                                                                    <li><a href="#">牛仔衣</a></li>
                                                                    <li><a href="#">短裤</a></li>
                                                                    <li><a href="#">绒裤</a></li>
                                                                    <li><a href="#">运动库</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">手机</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-6 mb-md-0">
                                                                    <li><a href="#">华为</a></li>
                                                                    <li><a href="#">小米</a></li>
                                                                    <li><a href="#">苹果</a></li>
                                                                    <li><a href="#">一加</a></li>
                                                                    <li><a href="#">魅族</a></li>
                                                                    <li><a href="#">OPPO</a></li>
                                                                    <li><a href="#">VIVO</a></li>
                                                                    <li><a href="#">三星</a></li>
                                                                    <li><a href="#">努比亚</a></li>
                                                                    <li><a href="#">其它</a></li>
                                                                </ul>
                                                            </div>
                                                            <div class="col-12 col-md-3 col-sm-6">
                                                                <!-- Heading -->
                                                                <div class="mb-2 font-w-5 text-link">图书</div>
                                                                <!-- Links -->
                                                                <ul class="list-unstyled mb-0">
                                                                    <li><a href="#">小说</a></li>
                                                                    <li><a href="#">儿童读物</a></li>
                                                                    <li><a href="#">漫画</a></li>
                                                                    <li><a href="#">期刊</a></li>
                                                                    <li><a href="#">杂志</a></li>
                                                                    <li><a href="#">计算机技术</a></li>
                                                                    <li><a href="#">农业科学</a></li>
                                                                    <li><a href="#">中国文学</a></li>
                                                                    <li><a href="#">书法篆刻</a></li>
                                                                    <li><a href="#">经典读物</a></li>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 d-none d-lg-block pr-2"><img
                                                            class="img-fluid rounded-bottom rounded-top"
                                                            src="/mallWeb/static/images/furniture/product/p4.jpg"
                                                            alt="..."></div>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle"
                                                                     href="${pageContext.request.contextPath}/blog-1">博客</a>
                                        <ul class="dropdown-menu">
                                            <li><a href="blog-grid.html">买家秀</a></li>
                                            <li><a href="blog-grid-left.html">卖家秀</a></li>
                                            <li><a href="blog-grid-right.html">发表博客</a></li>
                                        </ul>
                                    </li>
                                    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle"
                                                                     href="${pageContext.request.contextPath}/publish-book">发布闲置</a>
                                        <ul class="dropdown-menu">
                                            <li><a href="about-us.html">发布图书</a></li>
                                            <li><a href="login.html">发布手机</a></li>
                                            <li><a href="signup.html">发布衣服</a></li>
                                            <li><a href="forgot-password">其它</a></li>
                                        </ul>
                                    </li>

                                    <li class="nav-item"><a class="nav-link"
                                                            href="${pageContext.request.contextPath}/about-us-1">关于我们</a>
                                    </li>
                                </ul>
                            </div>
                            <div class="right-nav align-items-center d-flex justify-content-end">
                                <div class="mr-1 mr-sm-3 search-block"><a href="javascript:void(0);"
                                                                          class="search_trigger ml-3"><i
                                        class="las la-search"></i></a>
                                    <div class="search_wrap container"><span class="close-search"><i
                                            class="ion-ios-close-empty"></i></span>
                                        <form>
                                            <input type="text" placeholder="Search" class="form-control"
                                                   id="search_input">
                                            <button type="submit" class="search_icon"><i class="las la-search"></i>
                                            </button>
                                        </form>
                                    </div>
                                </div>
                                <div class="cart_box dropdown-menu dropdown-menu-right">
                                    <ul class="cart_list">
                                        <li><a href="#" class="item_remove"><i class="ion-ios-close-empty"></i></a> <a
                                                href="#"><img src="assets/images/product/p8.jpg" alt="cart_thumb1">Unpaired
                                            Running Shoes</a> <span class="cart_quantity"> 1 x <span
                                                class="cart_amount"> <span
                                                class="price_symbole">$</span></span>78.00</span></li>
                                        <li><a href="#" class="item_remove"><i class="ion-ios-close-empty"></i></a> <a
                                                href="#"><img src="assets/images/product/p12.jpg" alt="cart_thumb2">Unpaired
                                            Running Shoes</a> <span class="cart_quantity"> 1 x <span
                                                class="cart_amount"> <span
                                                class="price_symbole">$</span></span>81.00</span></li>
                                    </ul>
                                </div>
                            </div>
                        </nav>
                    </div>
                    <div class="log_reg" style="padding-top: 20px;text-align:center;">
                        <a href="${pageContext.request.contextPath}/login"><span>登录</span></a>&nbsp;&nbsp;<a
                            href="${pageContext.request.contextPath}/register"><span>注册</span></a>&nbsp;&nbsp;
                    </div>
                </div>
            </div>
        </div>
    </header>

    <!--header end-->

    <!--body content start-->

    <div class="page-content">

        <!--login start-->
        <section class="bg-light register">
            <div class="container">
                <div class="row justify-content-center text-center">
                    <div class="col-10 col-lg-7 col-md-9 shadow p-6 bg-white">
                        <div class="col-lg-12 col-md-12 p-0">
                            <div class="mb-6">
                                <h2 class="font-w-6">新建客户帐号</h2>
                                <p>创建一个新用户，欢迎你的到来. </p>
                            </div>
                        </div>
                        <div class="col-lg-12 col-md-12 ml-auto mr-auto p-0">
                            <div class="register-form text-center">
                                <form id="contact-form" onsubmit="return checkAgreement();">
                                    <div class="messages"></div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <input type="text" name="username" class="form-control"
                                                       placeholder="请输入您的用户名" required data-error="用户名不能为空">
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <select id="sex" name="sex" class="form-control">
                                                    <option value="男">请选择您的性别</option>
                                                    <option value="男">男</option>
                                                    <option value="女">女</option>
                                                </select>
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <select id="age" name="age" class="form-control">
                                                    <option value="1">请选择您的年龄</option>
                                                    <option value="1">1</option>
                                                    <option value="2">2</option>
                                                    <option value="3">3</option>
                                                    <option value="4">4</option>
                                                    <option value="5">5</option>
                                                    <option value="6">6</option>
                                                    <option value="7">7</option>
                                                    <option value="8">8</option>
                                                    <option value="9">9</option>
                                                    <option value="10">10</option>
                                                    <option value="11">11</option>
                                                    <option value="12">12</option>
                                                    <option value="13">13</option>
                                                    <option value="14">14</option>
                                                    <option value="15">15</option>
                                                    <option value="16">16</option>
                                                    <option value="17">17</option>
                                                    <option value="18">18</option>
                                                    <option value="19">19</option>
                                                    <option value="20">20</option>
                                                    <option value="21">21</option>
                                                    <option value="22">22</option>
                                                    <option value="23">23</option>
                                                    <option value="24">24</option>
                                                    <option value="25">25</option>
                                                    <option value="26">26</option>
                                                    <option value="27">27</option>
                                                    <option value="28">28</option>
                                                    <option value="29">29</option>
                                                    <option value="30">30</option>
                                                    <option value="31">31</option>
                                                    <option value="32">32</option>
                                                    <option value="33">33</option>
                                                    <option value="34">34</option>
                                                    <option value="35">35</option>
                                                    <option value="36">36</option>
                                                    <option value="37">37</option>
                                                    <option value="38">38</option>
                                                    <option value="39">39</option>
                                                    <option value="40">40</option>
                                                    <option value="41">41</option>
                                                    <option value="42">42</option>
                                                    <option value="43">43</option>
                                                    <option value="44">44</option>
                                                    <option value="45">45</option>
                                                    <option value="46">46</option>
                                                    <option value="47">47</option>
                                                    <option value="48">48</option>
                                                    <option value="49">49</option>
                                                    <option value="50">50</option>
                                                    <option value="51">51</option>
                                                    <option value="52">52</option>
                                                    <option value="53">53</option>
                                                    <option value="54">54</option>
                                                    <option value="55">55</option>
                                                    <option value="56">56</option>
                                                    <option value="57">57</option>
                                                    <option value="58">58</option>
                                                    <option value="59">59</option>
                                                    <option value="60">60</option>
                                                </select>
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <select id="school" class="form-control" name="school">
                                                    <option value="遵义师范学院">选择您所在的学校</option>
                                                    <option value="遵义师范学院">遵义师范学院</option>
                                                    <option value="遵义医科大学">遵义医科大学</option>
                                                    <option value="遵义医科大学医学与科技学院">遵义医科大学医学与科技学院</option>
                                                    <option value="遵义医药高等专科学校">遵义医药高等专科学校</option>
                                                    <option value="遵义职业技术学院">遵义职业技术学院</option>
                                                    <option value="贵州航天职业技术学院">贵州航天职业技术学院</option>
                                                </select>
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <input id="form_email" type="email" name="email" class="form-control"
                                                       pattern="[\w-]+(\.[\w-]+)*@([\w-]+\.)+\w{2,14}"
                                                       placeholder="电子邮箱" required data-error="电子邮箱格式为xxx@.xx.com">
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <input id="form_phone" type="tel" name="phone" class="form-control"
                                                       placeholder="电话" pattern="^(13|14|15|17|18)[0-9]{9}$" required
                                                       data-error="请输入正确的电话号码">
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <input id="form_password" type="password" name="password"
                                                       class="form-control" placeholder="密码"
                                                       pattern="[0-9A-Za-z]{5,17}$" required
                                                       data-error="必须包含字母和数字，且长度在6~18之间">
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <input id="form_password1" type="password" name="password1"
                                                       class="form-control" placeholder="确认密码"
                                                       pattern="[0-9A-Za-z]{5,17}$" required
                                                       data-error="必须包含字母和数字，且长度在6~18之间">
                                                <div class="help-block with-errors"></div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row mt-5">
                                        <div class="col-md-12">
                                            <div class="remember-checkbox clearfix mb-5">
                                                <div class="custom-control custom-checkbox">
                                                    <!-- 隐私要求点击按钮 -->
                                                    <input type="checkbox" class="custom-control-input"
                                                           id="customCheck1">
                                                    <label class="custom-control-label" for="customCheck1"><a
                                                            href="${pageContext.request.contextPath}/privacy-policy-1">我同意使用条款和隐私政策</a></label>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <input type="submit" onclick="login()" class="btn btn-primary" value="创建帐户">
                                            <span class="mt-4 d-block">你有账户 ? <a href="login.html">登录!</a></span>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>


        <!--login end-->


    </div>

    <!--body content end-->


    <!--footer start-->

    <footer class="py-11 bg-dark-1">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-4"><a class="footer-logo text-white h2 mb-0" href="index.html"> <img
                        class="img-fluid" src="/mallWeb/static/images/share/Zync_logo.png" alt=""> </a>
                    <p class="my-3 text-muted pr-6">托马斯滴滴吹，但我们不吹，我们致力于把最优质的服务给顾客，把最稳定的机会给商家，把最难攻克的难题留给自己！</p>
                    <ul class="list-inline mb-0">
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/WeChat.png" width="30" height="30"></a></li>
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/Moments.png" width="30" height="30"></a></li>
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/Zhi.png" width="30" height="30"></a></li>
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/QQ.png" width="30" height="30"></a></li>
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/MicroBlog.png" width="30" height="30"></a></li>
                        <li class="list-inline-item"><a class="text-muted ic-2x" href="#"><img
                                src="/mallWeb/static/images/share/Tik%20Tok.png" width="30" height="30"></a></li>
                    </ul>
                </div>
                <div class="col-12 col-lg-8 mt-6 mt-lg-0">
                    <div class="row">
                        <div class="col-12 col-sm-4 navbar-white">
                            <h6 class="mb-4 text-white font-w-5">快速连接</h6>
                            <ul class="navbar-nav list-unstyled mb-0">
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/index-1">首页</a>
                                </li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/about-us">关于我们</a>
                                </li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/privacy-policy">隐私权政策</a>
                                </li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/faq">常见问题</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/blog-1">博客</a>
                                </li>
                                <li class="nav-item"><a class="nav-link text-muted font-w-4"
                                                        href="${pageContext.request.contextPath}/contact-us">联系我们</a>
                                </li>
                            </ul>
                        </div>
                        <div class="col-12 col-sm-4 mt-6 mt-sm-0 navbar-white">
                            <h6 class="mb-4 text-white font-w-5">资讯</h6>
                            <ul class="navbar-nav list-unstyled mb-0">
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/terms-and-conditions">服务条款</a>
                                </li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4"
                                                             href="${pageContext.request.contextPath}/privacy-policy">隐私权政策</a>
                                </li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">帮助</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">订单历史</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">您的账号</a></li>
                                <li class="nav-item"><a class="nav-link text-muted font-w-4" href="#">供应商</a></li>
                            </ul>
                        </div>
                        <div class="col-12 col-sm-4 mt-6 mt-sm-0 navbar-white">
                            <h6 class="mb-4 text-white font-w-5">购物指南</h6>
                            <ul class="navbar-nav list-unstyled mb-0">
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">网站导航</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">搜索条件</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">高级搜索</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">退货政策</a></li>
                                <li class="mb-3 nav-item"><a class="nav-link text-muted font-w-4" href="#">我的订单</a></li>
                                <li class="nav-item"><a class="nav-link text-muted font-w-4" href="#">分类查询</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row pt-9">
                <div class="col-lg-4 col-md-6 col-sm-12">
                    <div class="d-flex footer-box">
                        <div class="mr-4"><i class="las la-map-marker-alt ic-2x icon-img"></i></div>
                        <div>
                            <h6 class="mb-1 text-white font-w-5">地址</h6>
                            <p class="mb-0 font-w-4 text-muted">贵州省遵义市红花岗区遵义师范学院
                                新蒲校区</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 col-sm-12">
                    <div class="d-flex footer-box">
                        <div class="mr-4"><i class="las la-envelope ic-2x icon-img"></i></div>
                        <div>
                            <h6 class="mb-1 text-white font-w-5">邮箱地址</h6>
                            <a class="text-muted font-w-4" href="https://china.nba.com/wizards">
                                Russ0520@163.com</a><br>
                            <a class="text-muted font-w-4" href="https://china.nba.com/thunder"> 2870088768@qq.com</a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-12 col-sm-12 mt-md-3 mt-lg-0">
                    <div class="d-flex footer-box">
                        <div class="mr-4"><i class="las la-mobile ic-2x icon-img"></i></div>
                        <div>
                            <h6 class="mb-1 text-white font-w-5">24h服务电话</h6>
                            <p class="mb-0 font-w-4 text-muted">以及征求建议电话 <br>
                                +86 1314 520 159 </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row text-muted align-items-center pt-9">
                <div class="col-md-7 font-w-4"><small>版权：托马斯滴滴吹版权所有.</small></div>
                <div class="col-md-5 text-md-right mt-3 mt-md-0">
                    <ul class="list-inline mb-0">
                        <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                       src="/mallWeb/static/images/share/Zhi.png"
                                                                       width="40" height="0"> </a></li>
                        <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                       src="/mallWeb/static/images/share/WeChatPay.png"
                                                                       width="40" height="40"> </a></li>
                        <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                       src="/mallWeb/static/images/share/QuickPass.png"
                                                                       width="40" height="40"> </a></li>
                        <li class="list-inline-item"><a href="#"> <img class="img-fluid"
                                                                       src="/mallWeb/static/images/share/CarPay.png"
                                                                       width="40" height="40"> </a></li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>

    <!--footer end-->

</div>

<!-- page wrapper end -->


<!-- 快速查看 Modal模式，商品详情的弹窗 -->
<div class="modal fade view-modal" id="quick-view" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <button type="button" class="close-quickview" data-dismiss="modal" aria-label="Close"><i
                    class="ion-ios-close-empty"></i></button>
            <div class="modal-body">
                <div class="row align-items-center">
                    <div class="col-lg-5 col-12"><img class="img-fluid rounded"
                                                      src="/mallWeb/static/images/product/p11.jpg" alt=""/></div>
                    <div class="col-lg-7 col-12 mt-5 mt-lg-0">
                        <div class="product-details">
                            <h1 class="h4 mb-0 font-w-6">Unpaired Running Shoes</h1>
                            <div class="star-rating mb-4"><i class="las la-star"></i><i class="las la-star"></i><i
                                    class="las la-star"></i><i class="las la-star"></i><i class="las la-star"></i>
                            </div>
                            <span class="product-price h5 text-red-1">￥25.00 <del
                                    class="text-muted h6">￥35.00</del></span>
                            <ul class="list-unstyled my-3">
                                <li><small>Availibility: <span class="text-green"> In Stock</span> </small>
                                </li>
                                <li class="font-w-4"><small>Categories :<span class="text-muted"> womens, clothing, dresses, footwear</span></small>
                                </li>
                            </ul>
                            <p class="mb-4 desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam fringilla
                                augue nec est tristique auctor. Donec non est at libero vulputate rutrum. vulputate
                                adipiscing cursus eu, suscipit id nulla. quis fermentum turpis eros eget velit.</p>
                            <div class="d-sm-flex align-items-center mb-5">
                                <div class="d-flex align-items-center mr-sm-4">
                                    <button class="btn-product btn-product-up"><i class="las la-minus"></i>
                                    </button>
                                    <input class="form-product" type="number" name="form-product" value="1">
                                    <button class="btn-product btn-product-down"><i class="las la-plus"></i>
                                    </button>
                                </div>
                                <select class="custom-select mt-3 mt-sm-0" id="inputGroupSelect02">
                                    <option selected>Size</option>
                                    <option value="1">XS</option>
                                    <option value="2">S</option>
                                    <option value="3">M</option>
                                    <option value="3">L</option>
                                    <option value="3">XL</option>
                                    <option value="3">XXL</option>
                                </select>
                                <div class="d-flex text-center ml-sm-4 mt-3 mt-sm-0">
                                    <div class="form-check pl-0 mr-2">
                                        <input type="radio" class="form-check-input" id="color-filter1" name="Radios">
                                        <label class="form-check-label" for="color-filter1"
                                               data-bg-color="#ffc107"></label>
                                    </div>
                                    <div class="form-check pl-0 mr-2">
                                        <input type="radio" class="form-check-input" id="color-filter2" name="Radios"
                                               checked>
                                        <label class="form-check-label" for="color-filter2"
                                               data-bg-color="#6d5b97"></label>
                                    </div>
                                    <div class="form-check pl-0 mr-2">
                                        <input type="radio" class="form-check-input" id="color-filter3" name="Radios">
                                        <label class="form-check-label" for="color-filter3"
                                               data-bg-color="#88b04b"></label>
                                    </div>
                                    <div class="form-check pl-0">
                                        <input type="radio" class="form-check-input" id="color-filter4" name="Radios">
                                        <label class="form-check-label" for="color-filter4"
                                               data-bg-color="#23a5a8"></label>
                                    </div>
                                </div>
                            </div>
                            <div class="d-sm-flex align-items-center mt-5">
                                <button class="btn btn-primary btn-animated mr-sm-3 mb-3 mb-sm-0"><i
                                        class="las la-shopping-cart mr-2"></i>加入购物车
                                </button>
                                <a class="btn btn-animated btn-dark" href="#"> <i class="lar la-heart mr-2 ic-1-2x"></i>加入收藏
                                </a>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--back-to-top start-->

<div class="scroll-top"><a class="smoothscroll" href="#top"><i class="las la-angle-up"></i></a></div>

<!--back-to-top end-->

<!-- inject js start -->
<script src="/mallWeb/static/js/popper.min.js"></script>
<script src="/mallWeb/static/js/bootstrap.min.js"></script>
<script src="/mallWeb/static/js/owl.carousel.min.js"></script>
<script src="/mallWeb/static/js/light-slider.js"></script>
<script src="/mallWeb/static/js/parallax.js"></script>
<script src="/mallWeb/static/js/magnific-popup.min.js"></script>
<script src="/mallWeb/static/js/jquery.countdown.min.js"></script>
<script src="/mallWeb/static/js/jquery.dd.min.js"></script>
<script src="/mallWeb/static/js/validator.js"></script>
<script src="/mallWeb/static/js/wow.js"></script>
<script src="/mallWeb/static/js/theme-script.js"></script>
<script src="/mallWeb/static/js/mall.js" type="text/javascript"></script>
<!-- inject js end -->

<script type="text/javascript">
    function checkAgreement() {
        if (document.getElementById("customCheck1").checked == false) {
            layui.use('layer', function () {
                layer.open({
                    title: '注册提示',
                    content: '注册请同意条款和隐私政策',
                    //btn: ['确认', '取消'],
                })
            })
            document.getElementById("customCheck1").focus();
            return false;
        }
        return true;
    }
</script>

<script type="text/javascript">

    function login() {

        layui.use(['layer', 'form', 'jquery'], function () {
            var layer = layui.layer
                , form = layui.form
                , $ = layui.$;

            $('#contact-form').validator();
            $('#contact-form').on('submit', function (e) {

                // if the validator does not prevent form submit
                if (!e.isDefaultPrevented()) {

                    var url = "addUser";

                    // POST values in the background the the script URL
                    $.ajax({
                        type: "POST",
                        url: url,
                        data: $("#contact-form").serialize(),
                        success: function (data) {

                            if (data.success != null) {

                                window.location.href = "login"
                            } else if (data.incorrect != null) {

                                layui.use('layer', function () {
                                    layer.open({
                                        title: '注册提示',
                                        content: '您的密码前后不一致，请重新输入',
                                        //btn: ['确认', '取消'],
                                    })
                                })
                            } else if (data.exist != null) {
                                layui.use('layer', function () {
                                    layer.open({
                                        title: '注册提示',
                                        content: '您的用户名或邮箱已注册',
                                        btn: ['重新注册', '去登录'],
                                        yes: function (index, layero) {
                                            layer.close(index)
                                            $('#contact-form')[0].reset();
                                        },
                                        btn2: function (index, layero) {
                                            window.location.href = "login"
                                        }
                                    })
                                })
                            }


                        }
                    });
                    return false;
                }
            })
        })
    }


</script>
<script type="text/javascript">
    $(function () {
        helangSearch.init();
    })
</script>
<script type="text/javascript">
    /* 搜索 */
    var helangSearch = {


        /* 元素集 */
        els: {},
        /* 搜索类型序号 */
        searchIndex: 0,
        /* 火热的搜索列表 */
        hot: {
            /* 颜色 */
            color: ['#ff2c00', '#ff5a00', '#ff8105', '#fd9a15', '#dfad1c', '#6bc211', '#3cc71e', '#3cbe85'],
            /* 列表 */
            list: [
                $(".pickListModels").val(),
                $(".pickListModels").next().val(),
                $(".pickListModels").next().next().val(),
                $(".pickListModels").next().next().next().val(),
                $(".pickListModels").next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().next().val(),
                $(".pickListModels").next().next().next().next().next().next().next().val()
            ]
        },
        /* 初始化 */
        init: function () {
            var _this = this;
            this.els = {
                pickerBtn: $(".picker"),
                pickerList: $(".picker-list"),
                logo: $(".logo"),
                hotList: $(".hot-list"),
                input: $("#search-input"),
                button: $(".search")
            };

            /* 注册事件 */
            /* 搜索类别选择按钮 */
            this.els.pickerBtn.click(function () {
                if (_this.els.pickerList.is(':hidden')) {
                    setTimeout(function () {
                        _this.els.pickerList.show();
                    }, 100);
                }
            });
            /* 搜索类别选择列表 */
            this.els.pickerList.on("click", ">li", function () {
                _this.els.logo.css("background-image", ('url(img/' + $(this).data("logo") + ')'));
                _this.searchIndex = $(this).index();
                _this.els.pickerBtn.html($(this).html())
            });
            /* 搜索 输入框 点击*/
            this.els.input.click(function () {
                if (!$(this).val()) {
                    setTimeout(function () {
                        _this.els.hotList.show();
                    }, 100);
                }
            });
            /* 搜索 输入框 输入*/
            this.els.input.on("input", function () {
                if ($(this).val()) {
                    _this.els.hotList.hide();
                }
            });

            /* 设置热门搜索列表 */
            if (_this.searchIndex == 0) {
                this.els.hotList.html(function () {
                    var str = '';
                    $.each(_this.hot.list, function (index, content) {
                        str += '<a href="product-1?content=' + content + '" >'
                            + '<div class="number" style="color: ' + _this.hot.color[index] + '">' + (index + 1) + '</div>'
                            + '<div>' + content + '</div>'
                            + '</a>';
                    });
                    return str;
                });

            }
            /* 搜索按钮 */
            this.els.button.click(function () {
                /*
                    *icon
                    *1为勾勾
                    *2为叉叉
                    *3为问号
                    *4为锁
                    *5为难过表情
                    *6为笑脸表情
                    *7为感叹号
                    *最多为7不能再多了
                    */
                //var searchArr=['商品','店铺','用户','博客'];
                if (_this.els.input.val() == "") {
                    layui.use(['layer', 'form', 'jquery'], function () {
                        var layer = layui.layer
                            , form = layui.form
                            , $ = layui.$;

                        layui.use('layer', function () {
                            layer.msg('内容不能为空', {icon: 6})
                        })

                    })

                } else {
                    //跳转到商品
                    if (_this.searchIndex == 0) {
                        $.ajax({
                            type: "POST",
                            url: "search-1?content=" + _this.els.input.val(),
                            contentType: "application/json",
                            data: {
                                //"content":_this.els.input.val()
                            },
                            datatype: 'json',
                            error: function () {
                                alert("error")
                                return false;
                            },
                            success: function (data) {
                                if (data.success != null) {
                                    window.location.href = "product-1?content=" + _this.els.input.val()
                                } else if (data.nosearch != null) {
                                    layui.use('layer', function () {
                                        layer.msg('您搜索的内容不存在，请重新搜索', {icon: 3})
                                    })
                                }
                            }
                        })
                        //window.location.href="product-1?content="+_this.els.input.val()
                    }
                    //跳转到店铺
                    else if (_this.searchIndex == 1) {
                        window.location.href = "blog-1"
                    }
                    //跳转到用户
                    else if (_this.searchIndex == 2) {
                        window.location.href = "blog-1"
                    }
                    //跳转到博客
                    else if (_this.searchIndex == 3) {
                        window.location.href = "blog-1"
                    }
                }
            });
            /* 文档 */
            $(document).click(function () {
                _this.els.pickerList.hide();
                _this.els.hotList.hide();
            });
            /* 搜索按钮 */
        }

    };

</script>
</body>
</html>
